(function(){
    // var origin = "http://www.gojiw.com/gojiw/index/index_recycle/index.php/Admin/Ajax/get_brand_version"
    
    var app = new Vue({
        el: "#app-root",
        data: {
            brands: [],

            m_title: '',

            b_name: '', 
            b_id: '',

            add_or_edit: 'add',
            v_name: '',
            v_id: '',
            v_imgurl: '',

            error: 0,
            error_message: ''
        },
        created: function(){
            var _this = this;
            $.ajax({
                url: '/Admin/Ajax/get_brand_version',
                type: 'GET',
                dataType: 'json',
                success: function(redata){
                    if (redata.code == 200) {
                        _this.brands = redata.data;
                    } else {
                        console.log(redata.message);
                    }
                },
                error: function(e){
                    console.log(e);
                }
            });
        },
        methods: {
            ok: function(){
                this.delegate_delete();
            },
            delegate_delete: function(){},
            refresh: function(){
                var _this = this;
                this.v_name = '';
                this.v_id = '';
                this.v_imgurl = '';
                this.b_id = '';
                this.b_name = '';
                this.m_title = '';
                $.ajax({
                    url: '/Admin/Ajax/get_brand_version',
                    type: 'GET',
                    dataType: 'json',
                    success: function(redata){
                        if (redata.code == 200) {
                            _this.brands = redata.data;
                        } else {
                            console.log(redata.message);
                        }
                    },
                    error: function(e){
                        console.log(e);
                    }
                });
            },
            addMobileBrand: function(){
                this.error = 0;
                this.error_message = '';
                this.m_title = '添加品牌';
                $('#brandModal').modal('show');
            },
            addMobileVersion: function(id){
                this.error = 0;
                this.error_message = '';
                this.add_or_edit = 'add';
                this.b_id = id;
                this.m_title = '添加机型';
                this.v_name = '';
                $("#dynamic-html").html('<div id="uploader" class="wu-example">' +
                                    '<div id="thelist" class="uploader-list"></div>' +
                                    '<div class="btns"><div id="picker">选择图片</div></div>' +
                                '</div>');
                $('#versionModal').modal('show');
                setTimeout(function(){
                    fileUploadFunc();
                }, 200);
            },
            editMobileBrand: function(id, e){
                this.error = 0;
                this.error_message = '';
                this.b_id = id;
                this.m_title = '编辑品牌';
                this.b_name = $(e.target).html();
                $('#brandModal').modal('show');
            },
            update_version: function(id){},
            editMobileVersion: function(id, e){
                this.error = 0;
                this.error_message = '';
                this.add_or_edit = 'edit';
                this.v_id = id;
                this.m_title = '编辑机型';
                this.v_name = $(e.target).attr('data-name');
                $("#dynamic-html").html('<div id="uploader" class="wu-example">' +
                                    '<div id="thelist" class="uploader-list"></div>' +
                                    '<div class="btns"><div id="picker">选择图片</div></div>' +
                                '</div>');
                $('#versionModal').modal('show');
                setTimeout(function(){
                    fileUploadFunc();
                }, 200);
            },
            delete_brand: function(id){
                $('#confirmModal').modal('show');
                app.delegate_id = id;
                app.delegate_delete = function(){
                    $.ajax({
                        url: '/Admin/Ajax/del_brand',
                        type: 'POST',
                        data: { bid: app.delegate_id },
                        dataType: 'json',
                        success: function(redata){
                            if (redata.code == 200) {
                                console.log("删除成功");
                                app.refresh();
                            } else {
                                console.log(redata.message);
                            }
                        },
                        error: function(e){
                            console.log(e);
                        }
                    });
                }
            },
            delete_version: function(id){
                $('#confirmModal').modal('show');
                app.delegate_id = id;
                app.delegate_delete = function(){
                    $.ajax({
                        url: '/Admin/Ajax/del_version',
                        type: 'POST',
                        data: { vid: app.delegate_id },
                        dataType: 'json',
                        success: function(redata){
                            if (redata.code == 200) {
                                console.log("删除成功");
                                app.refresh();
                            } else {
                                console.log(redata.message);
                            }
                        },
                        error: function(e){
                            console.log(e);
                        }
                    });
                }
            },
            submitBrand: function(){
                var _this = this;
                if (!this.b_name) {
                    this.error_message = '请输入品牌';
                    this.error = 1;
                    return false;
                } else {
                    this.error_message = '';
                    this.error = 0;
                }
                var data = {
                    name: this.b_name
                };
                var url = '/Admin/Ajax/add_brand';
                if (this.b_id) {
                    data.bid = this.b_id;
                    url = '/Admin/Ajax/edit_brand'
                }
                $.ajax({
                    url: url,
                    type: 'POST',
                    dataType: 'json',
                    data: data,
                    success: function(redata){
                        if (redata.code != 200) {
                            console.log(redata.message);
                        } else {
                            $('#brandModal').modal('hide');
                            _this.refresh();
                        }
                    },
                    error: function(e){
                        console.log(e);
                    }
                });
            },
            submitVersion: function(){
                var _this = this;
                if (!this.v_name || !this.v_imgurl) {
                    if (!this.v_name) {
                        this.error_message = '请输入机型。';
                    }
                    if (!this.v_imgurl) {
                        this.error_message += '请上传图片。';
                    }
                    this.error = 1;
                    return false;
                } else {
                    this.error_message = '';
                    this.error = 0;
                }
                var data = {
                    name: this.v_name,
                    imgurl: this.v_imgurl
                };
                var url;
                if (this.add_or_edit === "add") {
                    url = '/Admin/Ajax/add_version';
                    data.bid = this.b_id;
                } else if (this.add_or_edit === "edit") {
                    data.vid = this.v_id;
                    url = '/Admin/Ajax/edit_version'
                }
                $.ajax({
                    url: url,
                    type: 'POST',
                    dataType: 'json',
                    data: data,
                    success: function(redata){
                        if (redata.code != 200) {
                            console.log(redata.message);
                        } else {
                            $('#versionModal').modal('hide');
                            _this.refresh();
                        }
                    },
                    error: function(e){
                        console.log(e);
                    }
                });
            }
        }
    });
    var fileUploadFunc = function(){
        var $list = $('#thelist');
        var uploader = WebUploader.create({

            auto: true,

            // swf文件路径
            swf: '../../plugins/webuploader-0.1.5/Uploader.swf',

            // 文件接收服务端。
            server: 'http://image.txiaoyuan.cn/index.php/Home/Image/uploadImage?platform=goji',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: '#picker',

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            resize: false
        });
        // 当有文件被添加进队列的时候
        uploader.on( 'fileQueued', function( file ) {
            $list.append( '<div id="' + file.id + '" class="item">' +
                // '<h4 class="info">' + file.name + '</h4>' +
                '<p class="state">等待上传...</p>' +
            '</div>' );
        });
        // 文件上传过程中创建进度条实时显示。
        uploader.on( 'uploadProgress', function( file, percentage ) {
            var $li = $( '#'+file.id ),
                $percent = $li.find('.progress .progress-bar');

            // 避免重复创建
            if ( !$percent.length ) {
                $percent = $('<div class="progress progress-striped active">' +
                '<div class="progress-bar" role="progressbar" style="width: 0%">' +
                '</div>' +
                '</div>').appendTo( $li ).find('.progress-bar');
            }

            $li.find('p.state').text('上传中');

            $percent.css( 'width', percentage * 100 + '%' );
        });
        uploader.on( 'uploadSuccess', function( file, response ) {
            console.log(file);
            console.log(response);
            if(response.code==200){
                console.log(response.data);
                app.v_imgurl = response.data.img_origin;
                $( '#'+file.id ).find('p.state').text('已上传: ' + response.data.img_origin);
            }else{
                $( '#'+file.id ).find('p.state').text(response.message);
            }
        });

        uploader.on( 'uploadError', function( file ) {
            $( '#'+file.id ).find('p.state').text('上传出错');
        });

        uploader.on( 'uploadComplete', function( file ) {
            $( '#'+file.id ).find('.progress').fadeOut();
        });
    }
})();